<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta http-equiv="Cache-Control" content="no-siteapp">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes, minimum-scale=1.0, maximum-scale=1.0">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta content="telephone=no" name="format-detection">
    <meta content="email=no" name="format-detection">
    <title>APP下载引导页</title>
    <link rel="stylesheet" type="text/css" href="css/mobile-base.css" />
    <link rel="stylesheet" type="text/css" href="css/app-loading.css" />
    <script>
        (function (doc, win) {
            var docEl = doc.documentElement,
                    resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
                    recalc = function () {
                        var clientWidth = docEl.clientWidth;
                        if (!clientWidth) return;
                        var num= 20 * (clientWidth / 640);
                        if(num>13){
                            num=12.9375;
                            return;
                        }
                        docEl.style.fontSize = num + 'px';
                        //alert(num);
                    };

            if (!doc.addEventListener) return;
            win.addEventListener(resizeEvt, recalc, false);
            doc.addEventListener('DOMContentLoaded', recalc, false);
        })(document, window);
    </script>
</head>
<body>
<div class="loader" id="loading">
	<!--<div class="loader-classic" >-->
		<!--<span></span>-->
		<!--<span></span>-->
		<!--<span></span>-->
		<!--<span></span>-->
		<!--<span></span>-->
		<!--<span></span>-->
		<!--<span></span>-->
		<!--<span></span>-->
		<!--<span></span>-->
		<!--<span></span>-->
	<!--</div>-->
    <img src="images/onload-pic/logo.png">
</div>
<section>
    <div class="app-loading" id="pageContain" style="display: none;">
        <div  class="page page1 current">
            <div class="contain">
                <h2 class="animated dragTop">
                    300万保险人的选择<small>选择决定未来</small>
                </h2>
                <div class="map">
                    <span class="pro1"></span>
                    <span class="pro2"></span>
                    <span class="pro3"></span>
                    <span class="pro4"></span>
                    <span class="pro5"></span>
                    <span class="pro6"></span>
                    <span class="pro7"></span>
                    <span class="pro8"></span>
                    <span class="pro9"></span>
                </div>
                <div class="pages-num1"></div>
            </div>

        </div>
        <div class="page page2">
            <div class="contain">
                <h2 class="animated fadeInScale">
                    为保险行业私人定制<small>保险展业神器</small>
                </h2>
                <div class="pro-intro animated fadeInScale">
                    <span class="share-intro animated fadeInScale animated-delay05"></span>
                    <span class="collect-intro animated fadeInScale animated-delay1"></span>
                    <span class="call-intro animated fadeInScale animated-delay1"></span>
                    <span class="free-intro animated fadeInScale animated-delay05"></span>
                </div>
                <div class="pages-num2"></div>
            </div>
        </div>
        <div class="page page3">
            <div class="contain">
                <h2 class="animated fadeInLeft">
                    随时随地制作计划书<small>简单工作，开心生活</small>
                </h2>
                <div class="utility">
                    <span class="utility-circle animated rotateInDownRight animated-delay05"></span>
                    <span class="utility-bj animated fadeIn"></span>
                    <span class="cloud1 animated rotateInUpLeft"></span>
                    <span class="cloud2 animated rotateInUpLeft"></span>
                    <span class="cloud3 animated rotateInUpLeft"></span>
                    <span class="cloud4 animated fadeInRight"></span>
                    <span class="cloud5 animated fadeInRight"></span>
                    <span class="cloud6 animated fadeInRight"></span>
                </div>
                <a class="open-app-btn" id="open-app-btn" href="javascript:;">马上体验</a>
            </div>
        </div>
    </div>
</section>

<!--加载 js start-->
<script type="text/javascript" src="js/fullPage.min.js"></script>
<script type="text/javascript" src="js/loadPicOn.js"></script>
<script type="text/javascript">
    //禁止窗口的默认滑动
    document.ontouchmove = function(e){
        e.preventDefault();
    }
//    window.onload = function(){
//        document.getElementById("loading").style.display="none";
//        document.getElementById("pageContain").style.display="block";
//    };
    //滑动框架
    var runPage;
    runPage = new FullPage({
        id : 'pageContain',
        slideTime : 800,
        continuous : false,
        effect : {
            transform : {
                translate : 'X',
                scale : [1, 1],
                rotate : [0, 0]
            },
            opacity : [0, 1]
        },
        mode : 'touch',
        easing : 'ease',
        callback : function(index, thisPage) {
//            if(index==2){
//                alert(0);
//            }
        }
    });
    /*按钮跳转*/
    document.getElementById("open-app-btn").addEventListener("click",function(){
        window.location.href="http://www.baidu.com";
    })
    //cookie提示消失
    window.onload = function(){
        if(getCookie("app_loading")!=1){
            setTimeout(function() {
                //function r() {
                //	return 200 + parseInt(Math.random()*200, 10);
                //}

                var files = ["images/onload-pic/map.png",
                    "images/onload-pic/pro.png",
                    "images/onload-pic/pro-info.png",
                    "images/onload-pic/pro-share.png",
                    "images/onload-pic/pro-collect.png",
                    "images/onload-pic/pro-call.png",
                    "images/onload-pic/pro-free.png",
                    "images/onload-pic/utility-bj.png",
                    "images/onload-pic/page-num1.png",
                    "images/onload-pic/page-num2.png",
                    "images/onload-pic/page-num3.png",
                    "images/onload-pic/utility-crite.png",
                    "images/onload-pic/utility-text.png",
                    "images/onload-pic/cloud.png",
                    "images/onload-pic/cloud-has-text.png",
                ];
                //for (var i=0; i<10; i++) {
                //	files.push('http://placekitten.com/' + r() + '/' + r());
                //}

                //console.log('loading...');
                preloadImages(files)
                        .onprogress(function(data) {
                            var loaded = data.loadeds.length;
                            var all = data.files.length;
                            var progress = parseInt(100 * loaded / all, 10);

                            console.log(
                                    data.path, 'is loades.',
                                    'Status:', loaded + '/' + all, '(' + progress + '%)'
                            );

                            // show image on browser
                            //document.body.appendChild(data.image);
                        })
                        .onload(function(data) {
                            //console.log('Done.');
                            document.getElementById("loading").style.display="none";
                            document.getElementById("pageContain").style.display="block";
                        })
                        .onerror(function(data) {
                            //console.error('ERROR!', data.event);
                        });
            }, 1000);
            setCookie('app_loading','1');
            return;
        }
        else{
            //document.getElementById("pageContain").style.cssText="display:none";
            document.getElementById("loading").style.display="block";
            setTimeout(function(){
                window.location.href="http://www.baidu.com";
            },1000)
        }
    }
    /*cookie 方法调用*/
    function getCookie(name) {
        var cookie_start = document.cookie.indexOf(name);
        var cookie_end = document.cookie.indexOf(";", cookie_start);
        return cookie_start == -1 ? '' : unescape(document.cookie.substring(cookie_start + name.length + 1, (cookie_end > cookie_start ? cookie_end : document.cookie.length)));
    }
    function setCookie(cookieName, cookieValue) {
        var expires = new Date(new Date().getTime()+9999999999999);
        expires.setTime(expires.getTime());
        document.cookie = escape(cookieName) + '=' + escape(cookieValue)
        + (expires ? '; expires=' + expires.toGMTString() : '');
    }

</script>

<!--加载 js end-->
</body>
</html>
